<template>
	<view>
		<view style="height:92upx;position:fixed;top:0;background-color:#FFFFFF;width:750upx;z-index:99;">
			<view @click="backto()" style="position:absolute;width:150upx;height:92upx;float:left;line-height:92upx;">
				<text class="iconfont" style="color:#666666;font-size:48upx;">&#xe617;</text>
			</view>
			<view style="text-align:center;height:92upx;line-height:92upx;color:#000000;font-size:34upx;font-weight:700;">登录</view>
		</view>
		<view style="width:750upx;height:92upx;"></view>
		<view class="logo">
			<image src="../../static/logo.png"></image>
			<!-- <view>谷雨颐嘉健康服务平台</view> -->
		</view>
		<view class="input_lists">
			<view class="input_list">
				<input type="number" v-model="login.phone" placeholder="请输入账号" placeholder-style="font-size:26upx;color:#999999;" />
				<!-- <image src="../../static/clear.png"></image> -->
			</view>
			<view class="input_list">
				<input type="password" v-model="login.password" placeholder="请输入密码" placeholder-style="font-size:26upx;color:#999999;" />
				<!-- <image src="../../static/clear.png"></image> -->
			</view>
		</view>
		<view class="back_passwords">
			<view class="back_password" @click="find_password()" style="font-size:26upx">找回密码</view>
			<!-- <view class="back_register" @click="to_register()" style="font-size:26upx">注册</view> -->
			<view class="back_code" @click="code_login()" style="font-size:26upx">使用短信验证码登录</view>
		</view>
		<view class="btn-group">
			<view class="register">
				<view @click="to_register()">注册</view>
			</view>
			<view class="login">
				<view @click="login_in()">登录</view>
			</view>
		</view>
	</view>
</template>

<script>
	import request from '@/common/lib/request.js'
	export default {
		data() {
			return {
				baseUrl:request.common.baseUrl,
				login: {
					phone: '',
					password:''
				},
			}
		},
		onLoad:function(){
			uni.setNavigationBarTitle({
				title: '登录'
			});
		},
		methods: {
			backto(){
				uni.reLaunch({
					url:'/pages/index/index'
				})
			},
			login_in(){
				let reg = /^1[0-9]{10}$/;
				if (!this.login.phone) {
					uni.showToast({
						title: '请输入手机号',
						icon: 'none',
						duration: 2000,
					})
					return false
				} else {
					if (!reg.test(this.login.phone)) {
						uni.showToast({
							title: '请输入正确的手机号',
							icon: 'none',
							duration: 2000,
						})
						return false
					}
				}
				if (!this.login.password) {
					uni.showToast({
						title: '请输入密码',
						icon: 'none',
						duration: 2000,
					})
					return false
				}
				uni.request({
					url: request.common.baseUrl+'/api/login/wlogin',
					data: {
						phone:this.login.phone,
						password:this.login.password,
						login_type:1,
						openid:uni.getStorageSync('keyOpenid'),
						nickname:uni.getStorageSync('keyNickname'),
						headimgurl:uni.getStorageSync('keyHeadimgurl'),
						sex:uni.getStorageSync('keySex'),
						city:uni.getStorageSync('keywCity')
					},
					header: {
						'Content-Type':'application/json;charset=UTF-8',
						'Content-Type':'application/x-www-form-urlencoded'
					},
					success: (res) => {
						if(res.data.code==200){
							uni.setStorageSync('keyToken',res.data.data.Token)
							uni.navigateBack({
								delta:1
							})
						}else{
							uni.showToast({
								title:res.data.msg,
								icon: 'none',
							})
						}
					}
				});
			},
			find_password(){
				uni.navigateTo({
					url:'/pages/login/changepsd'
				})
			},
			to_register(){
				uni.navigateTo({
					url:'/pages/login/register'
				})
			},
			code_login(){
				uni.navigateTo({
					url:'/pages/login/verifylogin'
				})
			}
		}
	}
</script>

<style>
	@font-face {
	  font-family: 'iconfont';
	  src: url('@/static/font/iconfont.eot');
	  src: url('@/static/font/iconfont.eot?#iefix') format('embedded-opentype'),
		  url('@/static/font/iconfont.woff2') format('woff2'),
		  url('@/static/font/iconfont.woff') format('woff'),
		  url('@/static/font/iconfont.ttf') format('truetype'),
		  url('@/static/font/iconfont.svg#iconfont') format('svg');
	}
	.iconfont {
	  font-family: "iconfont" !important;
	  font-size: 34upx;
	  font-style: normal;
	  -webkit-font-smoothing: antialiased;
	  -moz-osx-font-smoothing: grayscale;
	}
page{
	background-color: #ffffff;
}
.logo{
	width:750upx;
	text-align:center;
}
.logo image{
	width:200upx;
	height:200upx;
	padding-top:100upx;
}
.logo view{
	font-size:32upx;
	color:#333333;
	margin-top:-10upx;
}
.back_passwords{
	width:600upx;
	height:80upx;
	margin:0 75upx;
	display:flex;
	justify-content:space-between;
}
.back_password{
	font-size:20upx;
	white-space:nowrap;
}
.back_register{
	font-size:20upx;
	white-space:nowrap;
}
.back_code{
	font-size:20upx;
	white-space:nowrap;
}
.input_lists{
	width:600upx;
	margin:100upx 75upx 15upx;
}
.input_list{
	width:600upx;
	height:100upx;
	position:relative;
}
.input_list input{
	width:600upx;
	height:100upx;
	font-size:32upx;
	color:#333333;
	float:left;
	border-bottom:1upx solid #f6f6f6;
}
.input_list image{
	width:20upx;
	height:20upx;
	float:right;
	position:absolute;
	margin-top:50upx;
	margin-left:-30upx;
}
.login{
	width: 45%;
	margin-top:50upx;
	text-align:center;
}
.login view{
	background-color:#52c41a;
	color:#FFFFFF;
	font-size:28upx;
	width:100%;
	height:80upx;
	line-height:80upx;
	border-radius:40upx;
}

.register{
	width: 45%;
	margin-top:50upx;
	text-align:center;
}
.register view{
	background-color:#1564e5;
	color:#FFFFFF;
	font-size:28upx;
	width:100%;
	height:80upx;
	line-height:80upx;
	border-radius:40upx;
}
.btn-group{
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0 30upx;
}
</style>
